<template>
	<view class="uni-pages">
		<view class="shop-Image">
			<image src="/static/icon/yinpin.png" style="width: 100%;height: 600rpx;" mode="aspectFit"></image>
		</view>
		<view class="padding bg-white">
			<view class="flex justify-between align-center padding-bottom-sm">
				<view class="text-red font-14">
					￥
					<text class="font-24">14.42</text>
				</view>
				<view style="position: relative;">
					<view class="text-666">
						可售库存6瓶
					</view>
				</view>
			</view>
			<view style="background-color: #F2F2F2; " class="margin-bottom-sm">
				<view class="flex flex-wrap padding-lr-sm" style="position: relative;">
					<view style="flex: 1 1 30%;margin: 5px;box-sizing: border-box;" v-for="(item,index) in 3">山西九九仓0瓶</view>
					<view class="triangle"></view>
				</view>
			</view>
			<view class="font-18 text-333 padding-bottom-sm">
				安神糖浆
			</view>
			<view class="padding-bottom-sm">
				120ml 贵州益佰制药股份有限公司
			</view>
			<view>
				山西药九九/山西药九九
			</view>
			
		</view>
		<view class="padding margin-top-sm font-14 bg-white">
			<view class="flex justify-start align-center padding-bottom-sm">
				<text class="margin-right title">建议零售价</text>
				<text class="margin-right content">￥29.9</text>
				<text style="color: #FE4A25;">客户毛利51.77%</text>
			</view>
			<view class="flex justify-start align-center padding-bottom-sm">
				<text class="margin-right title">中/大包装</text>
				<text class="margin-right content">1/60瓶</text>
				<text>可拆零</text>
			</view>
			<view class="flex justify-start align-center padding-bottom-sm">
				<text class="margin-right title">近/远效期</text>
			</view>
		</view>
		<view class="padding-tb margin-top-sm font-14 bg-white">
			<view class="flex justify-start align-center padding-bottom-sm">
				<view class="title-tag"></view>
				<text class="text-333 font-18">基本信息</text>
			</view>
			<view class="padding-lr">
				<view class="flex justify-start align-center padding-bottom-sm">
					<text class="margin-right title">通用名称</text>
					<text class="margin-right content">安神糖浆</text>
				</view>
				<view class="flex justify-start align-center padding-bottom-sm">
					<text class="margin-right title">生产厂家</text>
					<text class="margin-right content">贵州益佰制药股份有限公司</text>
				</view>
				<view class="flex justify-start align-center padding-bottom-sm">
					<text class="margin-right title">商品编码</text>
					<text class="margin-right content">EZH031001G00X</text>
				</view>
				<view class="flex justify-start align-center padding-bottom-sm">
					<text class="margin-right title">批准文号</text>
					<text class="margin-right content">国药准字Z0044187</text>
				</view>
				<view class="flex justify-start align-center padding-bottom-sm">
					<text class="margin-right title">处方分类</text>
					<text class="margin-right content">甲类</text>
				</view>
			</view>
			
		</view>
		
		<view class="padding-tb margin-top-sm font-14 bg-white">
			<view class="flex justify-start align-center padding-bottom-sm">
				<view class="title-tag"></view>
				<text class="text-333 font-18">说明书</text>
			</view>
			<view class="padding-lr" style="padding-left: 16rpx;">
				<view class="flex justify-start align-center padding-bottom-sm">
					<text class="margin-right title">【商品名称】</text>
					<text class="margin-right content">安神糖浆</text>
				</view>
				<view class="flex justify-start align-center padding-bottom-sm">
					<text class="margin-right title">【通用名称】</text>
					<text class="margin-right content">安神糖浆</text>
				</view>
				<view class="flex justify-start align-center padding-bottom-sm">
					<text class="margin-right title">【产地名称】</text>
					<text class="margin-right content">贵州益佰制药股份有限公司</text>
				</view>
				<view class="flex justify-start align-center padding-bottom-sm">
					<text class="margin-right title">【生产厂家】</text>
					<text class="margin-right content">贵州益佰制药</text>
				</view>
				<view class="flex justify-start align-center padding-bottom-sm">
					<text class="margin-right title">【不良反应】</text>
				</view>
				<view class="flex justify-start align-center padding-bottom-sm">
					<text class="margin-right title">【药理毒理】</text>
				</view>
				<view class="flex justify-start align-center padding-bottom-sm">
					<text class="margin-right title">【功能于主治】</text>
				</view>
				<view class="flex justify-start align-center padding-bottom-sm">
					<text class="margin-right title">【用法用量】</text>
				</view>
			</view>
		</view>
		<view style="height: 210rpx;" class="width-100 bg-white"></view>
		<view style="position: fixed;bottom: 0;width: 100%;">
			<view class="text-center text-14 flex justify-center align-center" style="background-color: #FFF7E8;height: 60rpx;">
				<text class="cuIcon-goodsnew text-orange margin-right-sm"></text>
				<text class="text-orange">太原市小店区梁栋诊所</text>
			</view>
			<view class="flex" style="height: 100rpx;">
				<view style="width: 220rpx;position: relative;" class="bg-white">
					<image src="/static/icon/yinpin.png" class="shop-image-icon"></image>
					<view style="position: absolute;top: -15px;right: 10px;border-radius: 18rpx;padding:4rpx 10rpx" class="bg-red font-10 text-white">99+</view>
				</view>
				<view v-if="shopType=='addShop'" class="bg-main-yellow-2 flex-1 flex justify-center align-center font-16">
					添加客户需求
				</view>
				<view v-if="shopType=='addQueShop'" class="bg-main-green flex-1 flex justify-center align-center font-16">
					加入缺货篮
				</view>
			</view>
			<view style="height: 50rpx;" class="width-100 bg-white"></view>
		</view>
	</view>
</template>

<script>
	export default {
			data() {
				return {
					shopType:"addQueShop",
					count:0
					
				}
			},
			methods: {
				
			}
		
	}
</script>

<style scoped lang="scss">
	.title{
		color: #828282;
	}
	.content{
		color: #333;
	}
	
	.uni-pages {
		height: 100vh;
		background-color: #F6F6F6;
	}
	.title-tag{
		width: 30rpx;
		height: 20rpx;
		background-image: linear-gradient(90deg, #6FCF97, #35DFE8,#fff);
	}
	/* 小三角样式 */
	.triangle {
	  position: absolute;
	  top: -20rpx;
	  right: 4rpx;
	  transform: translateX(-50%);
	  width: 0;
	  height: 0;
	  border-left: 8px solid transparent;
	  border-right: 8px solid transparent;
	  border-bottom: 10px solid #f5f5f5; /* 与弹窗背景色一致 */
	}
</style>